// 1. 封装格式化时间函数，支持 Date 和 string 格式的时间，可选参数，转换成功 10: 10: 10 时分秒
const formatTime = (time?: Date | string) => {
    if (typeof time === 'string') time = new Date(time)
    if (!time) time = new Date()
    // 获取时分秒
    const hours = time.getHours()
    const minutes = time.getMinutes()
    const seconds = time.getSeconds()
    return `${hours}:${minutes}:${seconds}`
}
console.log(formatTime())
console.log(formatTime('2025/02/11 08:30:06'))
console.log(formatTime(new Date()))
// 2. 定义访问记录单项 对象 类型，定义访问记录 列表 类型，需要存储在本地的 key 字面量类型
type Data = {
    count: number
    time: string
}
type List = Data[]

const KEY = 'refresh-demo'

// 3. 封装获取访问历史记录函数，返回类型是 记录列表
const getData = () => {
    const jsonStr = localStorage.getItem(KEY)
    return JSON.parse(jsonStr || '[]') as List
}
// 4. 封装修改访问历史记录函数
const setData = () => {
    const list = getData()
    const obj: Data = {
        count: list.length ? list[list.length - 1].count + 1 : 1,
        time: formatTime(new Date())
    }
    list.push(obj)
    localStorage.setItem(KEY, JSON.stringify(list))
}
// 5. 封装一个展示访问历史记录函数，且调用
const render = () => {
    setData()
    const listArr = getData()
    const divDom = document.querySelector('#app') as HTMLDivElement
    divDom.innerHTML = listArr
        .map((item) => `刷新次数为: ${item.count}, 刷新时的时间是: ${item.time}`)
        .join('<br>')
}
render()

export { KEY, getData }
